<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>Hello MUI</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<!--标准mui.css-->
		<link rel="stylesheet" href="css/mui.min.css">
		<link rel="stylesheet" href="css/main.css">
	</head>
	<body>
		
		<nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item">
				<span class="bar-bg index-bg"></span>
				<span class="mui-tab-label">住宅摇号</span>
			</a>
			<a class="mui-tab-item  mui-active">
				<span class="bar-bg find-bg"></span>
				<span class="mui-tab-label">车位摇号</span>
			</a>
			<a class="mui-tab-item" >
				<span class="bar-bg message-bg">
				</span>
				<span class="mui-tab-label">退出系统</span>
			</a>
		</nav>
		<div class="mui-content">
			<div id="tabbar-with-chat" class="mui-control-content mui-active">
				<div class="yhWrap">
					<div class="yhWrapI">
						<div class="yhTitle">车位摇号</div>
						<div class="yhNotice">
							<span class="yhN1">通知公告</span>
							<span class="yhN2">到指定地点进行公开摇号选房...</span>
							<span class="more"><font>更多</font><img src="images/b6.png" alt=""></span>
						</div>
						<div class="yhContent cars">
							<div class="yhContentInner"  id="cwry">
								<img src="images/b7.png" alt="">
								<div class="yw">摇号人员公示</div>
								<div class="yw">（700）</div>
							</div>
							<div class="yhContentInner" id="cwyh">
								<img src="images/b8.png" alt="">
								<div class="yw">摇号车位公示</div>
								<div class="yw">（700）</div>
							</div>
							<div class="yhContentInner" id="cwgs">
								<img src="images/b9.png" alt="">
								<div class="yw">摇号结果公示</div>
								<div class="yw">（666）</div>
							</div>
						</div>
						<div class="yhContent house" style="display: none;">
							<div class="yhContentInner" id="hzzgs">
								<img src="images/b7.png" alt="">
								<div class="yw">摇号住宅公示</div>
								<div class="yw">（1000）</div>
							</div>
							<div class="yhContentInner" id="hyhfy">
								<img src="images/b12.png" alt="">
								<div class="yw">摇号房源公示</div>
								<div class="yw">（800）</div>
							</div>
							<div class="yhContentInner" id="hyhgs">
								<img src="images/b9.png" alt="" >
								<div class="yw">摇号结果公示</div>
								<div class="yw">（888）</div>
							</div>
						</div>
					</div>
					<div class="fnWrap cars" >
						<div class="fnWrapCir">人员</div>
						<div class="fnWrapSq">
							<div>张三：1389584454</div>
							<div>身份证号：402195033204050692</div>
							<div>四栋203</div>
						</div>
					</div>
					<div class="fnWrap cars">
						<div class="fnWrapCir">车位</div>
						<div class="fnWrapSq">
							<div class="name">远大幸福家园</div>
							<div class="phone">4栋C206</div>
						</div>
					</div>
					
					<div class="fnWrap house" style="display: none;">
						<div class="fnWrapCir">人员</div>
						<div class="fnWrapSq">
							<div>张三：1389584454</div>
							<div>身份证号：402195033204050692</div>
							<div>三室一厅</div>
						</div>
					</div>
					<div class="fnWrap house" style="display: none;">
						<div class="fnWrapCir">房源</div>
						<div class="fnWrapSq">
							<div class="name2">远大幸福家园4栋2单元301号</div>
							<div class="phone2">三室两厅两卫</div>
						</div>
					</div>
					
					<div class="yhBtn cars" id="btntxt" >开始摇号</div>
					<div class="yhBtn house" id="btntxt2" style="display: none;">开始摇号</div>
					<div class="time">
						<span class="timeTitle">距开始车位摇号准备还有</span>
						
					</div>
				</div>
			</div>
		</div>
	</body>
	<script src="js/mui.min.js"></script>
	<script src="js/jquery.min.js"></script>
	<script src="js/time.js"></script>
	
	<script src="js/covervid.js"></script>	
	<script src="js/cj.js"></script>
	<script>
		mui.init({
			swipeBack:true //启用右滑关闭功能
		});
		function times(){
			var str = '<span id="day" class="td" style="opacity: 0;">--</span>'+
							'<span id="hours" class="td">--</span>'+
							'<span id="minutes" class="td">--</span>'+
							'<span id="seconds" class="td">--</span>'
			$(".time").append(str)
			var	day = document.getElementById('day');
			var	hours = document.getElementById('hours');
			var	minutes = document.getElementById('minutes');
			var seconds = document.getElementById('seconds');
			// 日 时 分 秒的dom对象
			countDownTime.init('2020/8/23 20:00:00', day, hours, minutes, seconds);
			countDownTime.start();
		}
		if(localStorage.getItem("page")==1){
			$(".mui-tab-item").each(function(){
				$(this).removeClass("mui-active")
			})
			$(".time").html('<span class="timeTitle">距开始车位摇号准备还有</span>');
			$(".yhTitle").html("车位摇号");
			times();
			$(".house").each(function(){
				$(this).hide();
			})
			$(".cars").each(function(){
				$(this).show();
			})
			
			$("#cwgs").on("click",function(){
				location.href="cwgs.html"
			})
			$("#cwyh").on("click",function(){
				location.href="cwyh.html"
			})
			$("#cwry").on("click",function(){
				location.href="cwry.html"
			})
			$(".mui-tab-item").eq(1).addClass("mui-active");
			localStorage.setItem("page",1)
		}else{
			$(".mui-tab-item").each(function(){
				$(this).removeClass("mui-active")
			})
			$(".time").html('<span class="timeTitle">距开始住宅摇号准备还有</span>');
			$(".yhTitle").html("住宅摇号");
			times();
			$(".house").each(function(){
				$(this).show();
			})
			$(".cars").each(function(){
				$(this).hide();
			})
			$("#hyhgs").on("click",function(){
				location.href="hcwgs.html"
			})
			$("#hyhfy").on("click",function(){
				location.href="hcwyh.html"
			})
			$("#hzzgs").on("click",function(){
				location.href="hcwry.html"
			})
			$(".mui-tab-item").eq(0).addClass("mui-active");
			localStorage.setItem("page",0)
		}
		
		
		
		
		$(".mui-tab-item").on("click",function(){
			$(".mui-tab-item").each(function(){
				$(this).removeClass("mui-active")
			})
			$(this).addClass("mui-active");
			var idx= $(this).index();
			if(idx==0){
				$(".time").html('<span class="timeTitle">距开始住宅摇号准备还有</span>');
				$(".yhTitle").html("住宅摇号");
				times();
				$(".house").each(function(){
					$(this).show();
				})
				$(".cars").each(function(){
					$(this).hide();
				})
				$("#hyhgs").on("click",function(){
					location.href="hcwgs.html"
				})
				$("#hyhfy").on("click",function(){
					location.href="hcwyh.html"
				})
				$("#hzzgs").on("click",function(){
					location.href="hcwry.html"
				})
				
			}else{
				$(".time").html('<span class="timeTitle">距开始车位摇号准备还有</span>');
				$(".yhTitle").html("车位摇号");
				times();
				$(".house").each(function(){
					$(this).hide();
				})
				$(".cars").each(function(){
					$(this).show();
				})
				
				$("#cwgs").on("click",function(){
					location.href="cwgs.html"
				})
				$("#cwyh").on("click",function(){
					location.href="cwyh.html"
				})
				$("#cwry").on("click",function(){
					location.href="cwry.html"
				})
			}
		});
		
		
		$(".yhNotice").on("click",function(){
			location.href="notice.html"
		})
		
		$("#btntxt").one("click",function(){
			start();
		})
		$("#btntxt2").one("click",function(){
			start2();
		})
	</script>
</html>